<template>
	<div class="modify-dialog">
		<slot>
			<el-button size="small" type="primary" @click="showDialog()">
				新增售后
			</el-button>
		</slot>
		<el-dialog v-bind="dialogOpts" :visible.sync="dialogVisible">
			<Form v-bind="formOpts" v-on="formEvent">
				<template #formSuf>
					<el-form-item label="产品" style="width: 100%">
						<ProductInput v-model="arr" />
					</el-form-item>
				</template>
				<template #formBtn>
					<div class="dialog-footer">
						<el-button @click="dialogVisible = false">取 消</el-button>
						<el-button type="primary" @click="onConfirm"> 确 定 </el-button>
					</div>
				</template>
			</Form>
		</el-dialog>
	</div>
</template>

<script>
import modifyMixins from "@/mixins/modifyMixins.vue";
import dayjs from "dayjs";
import ProductInput from "./ProductInput.vue";

export default {
	mixins: [modifyMixins],
	components: {
		ProductInput,
	},
	data() {
		return {
			dialogTitle: "新增售后",
			labelPosition: "left",
			dialogWidth: "700px",
			dialogTop: "8vh",
			form: {
				orderId: {
					tag: "el-select",
					label: "订单名称",
					value: "",
					items: [],
					props: {
						filterable: true,
						clearable: true,
						placeholder: "请选择订单名称",
					},
				},
				deliveryDate: {
					tag: "el-input",
					label: "发货时间",
					value: "",
					props: {
						disabled: true,
						placeholder: "请输入发货时间",
					},
				},
				installDate: {
					tag: "el-input",
					label: "安装时间",
					value: "",
					props: {
						disabled: true,
						placeholder: "请输入安装时间",
					},
				},
				afterSaleType: {
					tag: "el-select",
					label: "出单售后类型",
					value: [],
					items: [],
					props: {
						multiple: true,
						clearable: true,
						placeholder: "请选择出单售后类型",
					},
				},
				preSalesImg: {
					tag: "Uploader",
					label: "售后图片",
					value: [],
					props: {},
				},
				remark: {
					tag: "el-input",
					label: "备注",
					value: "",
					props: {
						type: "textarea",
						placeholder: "请输入备注",
					},
				},
			},
		};
	},
	watch: {
		"$store.state.aftersaleMap": {
			immediate: true,
			deep: true,
			handler(map) {
				this.form.afterSaleType.items = Object.keys(map).map((value) => ({
					value,
					label: map[value],
				}));
			},
		},
		"form.orderId.value"(value) {
			const { items } = this.form.orderId;
			const item = items.find((e) => e.id == value);
			try {
				this.form.deliveryDate.value = item?.deliveryDate;
				this.form.installDate.value = item?.installDate;
			} catch (e) {}
		},
	},
	computed: {},
	methods: {
		showDialog(modify = "add", row = {}) {
			this.dialogVisible = true;
			this.row = row;
			this.$api
				.orderOrderList({
					pageSize: 10000,
					pageNumber:1,
					
				})
				.then((res) => {
					this.form.orderId.items = (res?.data || [])
						.filter((e) => e.outStatus != 0)
						.map((e) => {
							return { label: e.storeName, value: e.id, ...e };
						});
					this.$nextTick(() => {
						this.formKey = this.$quinn.guid();
					});
				});
		},
		onSubmit(form) {
			const { modify, row, fileList } = this;
			const materials = this.arr
				.filter((e) => e.id && e.count)
				.map((e) => {
					return { id: e.id, norms: e.norms, count: e.count };
				});
			// if (!materials.length) return this.$message.error("请完善产品输入");
			form.materialsList = materials;
			// this.$api["newAfterSaleCreate"](form).then(this.submitDoneMsg);
			this.$api["afterSaleAfterSaleAdd"](form).then(this.submitDoneMsg);
			
		},
	},
};
</script>

<style lang="less" scoped></style>

